<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>入门案例</title>
	</head>
	<body>
		<div id="app">
			<!-- 1.规则: 遇到文本框 双向数据绑定.
				双向数据绑定的概念:
					1.用户的输入变化 则data数据变化.
					2.data数据变化, 则文本框的展现变化.
			 -->
			用户名: <input type="text" v-model="username"/>
			密码: <input type="text" v-model="password"/>
			<br>
			{{username}}
		</div>
		
		<script src="../js/vue.js"></script>
		<script>
			const app = new Vue({
				el: "#app",
				data: {
					username: '',
					password: ''
				}
			})
		</script>
	</body>
</html>
